body{
	background:#eff3f6 url("../images/bg_texture.jpg") repeat top left;
}


#wrapper{
	top:50%;
	margin-top:4%;
	overflow: visible;
}
.box{
    background:#fefefe;
    border: 1px solid #C3D4DB;
	border-top:1px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
    -moz-box-shadow:rgba(0,0,0,0.15) 0 0 1px;
    -webkit-box-shadow:rgba(0,0,0,0.15) 0 0 1px;
    box-shadow:rgba(0,0,0,0.15) 0 0 1px;
    color:#444;
    font:normal 12px/14px Arial, Helvetica, Sans-serif;
	overflow:hidden;
	margin-left:auto;
	margin-right:auto;
}
.box.login{
	height:242px;
    width:332px;
}
.box.verify{
    width:70%;
}
.login.logo a{
	margin-left:auto;
	margin-right:auto;
	display:block;
	background: url("../images/uwika_lengkap.png") no-repeat;
	height:134px;
    width:500px;
}
.boxBody
{
    background:#fefefe;
    border-top:1px solid #dde0e8;
    border-bottom:1px solid #dde0e8;
    padding:10px 20px;
}
.box.verify .boxBody{
	padding:0;
}
.box footer
{
    background:#f6f6f6;
    border-top:1px solid #fff;
    padding:22px 26px;
    overflow:hidden;
	height:32px;
}

.box label
{
	display:block;
    font: 13px/14px Arial, Helvetica, Sans-serif;
    margin:10px 0 0 6px;
}
.box footer label{
	float:left;
	margin:4px 0 0;
}
.box footer input[type=checkbox]{
	vertical-align:sub;
	*vertical-align:middle;
	margin-right:10px;
}
.box.verify h1{
	font-weight:bolder;
	font-size:22px;
	letter-spacing:3px;
	padding:0% 1%;
	line-height:120%;
}
.box.verify h4{
	line-height:120%;
	font-size:14px;
	letter-spacing:1px;
	padding:2% 5%;
}
.box input[type=text],
.box input[type=password],
.txtField,
.cjComboBox
{
    border:6px solid #F7F9FA;
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    border-radius:3px;
    -moz-box-shadow:2px 3px 3px rgba(0, 0, 0, 0.06) inset, 0 0 1px #95a2a7 inset;
    -webkit-box-shadow:2px 3px 3px rgba(0, 0, 0, 0.06) inset, 0 0 1px #95a2a7 inset;
    box-shadow:2px 3px 3px rgba(0, 0, 0, 0.06) inset, 0 0 1px #95a2a7 inset;
    margin:3px 0 4px;
    padding:8px 6px;
    width:270px;
    display:block;
}
.box input[type=text]:focus,
.box input[type=password]:focus,
.txtField:focus,
.cjComboBox:focus
{
    border:6px solid #f0f7fc;
    -moz-box-shadow:2px 3px 3px rgba(0, 0, 0, 0.04) inset, 0 0 1px #0d6db6 inset;
    -webkit-box-shadow:2px 3px 3px rgba(0, 0, 0, 0.04) inset, 0 0 1px #0d6db6 inset;
    box-shadow:2px 3px 3px rgba(0, 0, 0, 0.04) inset, 0 0 1px #0d6db6 inset;
	color:#333;
}
.cjComboBox{
    width:294px;
}
.cjComboBox.small{
    padding:3px 2px 3px 6px;
    width:100px;
    border-width:3px !important;
}
.txtField.small
{
    padding:3px 6px;
    width:200px;
    border-width:3px !important;
}
.rLink{padding:0 6px 0 0; font-size:11px; float:right;}

.box.verify a{
    -moz-border-radius:2px;
    -webkit-border-radius:2px;
    border-radius:15px;
    background:#a1d8f0;
    background:-moz-linear-gradient(top, #badff3, #7acbed);
    background:-webkit-gradient(linear, left top, left bottom, from(#badff3), to(#7acbed));
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#badff3', EndColorStr='#7acbed')";
    border:1px solid #7db0cc !important;
    cursor: pointer;
	padding:8px 15px;
    font:bold 12px/14px Verdana, Tahomma, Geneva;
    text-shadow:rgba(0,0,0,0.2) 0 1px 0px; 
    -moz-box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;
    -webkit-box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;
    box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;
	color:#fff;
}
.yes{
	float:left;
	margin-left:15%;
}
.no{
	float:right;
	margin-right:15%;
}
.box.verify a:hover,
.box.verify a:focus,
.box.verify a:active{
    background:#a1d8f0;
    background:-moz-linear-gradient(top, #7acbed, #badff3);
    background:-webkit-gradient(linear, left top, left bottom, from(#7acbed), to(#badff3));
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#7acbed', EndColorStr='#badff3')";
}
.box.verify a:active{
	text-shadow:rgba(0,0,0,0.3) 0 -1px 0px; 
}
.btnLogin{
    -moz-border-radius:2px;
    -webkit-border-radius:2px;
    border-radius:15px;
    background:#a1d8f0;
    background:-moz-linear-gradient(top, #badff3, #7acbed);
    background:-webkit-gradient(linear, left top, left bottom, from(#badff3), to(#7acbed));
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#badff3', EndColorStr='#7acbed')";
    border:1px solid #7db0cc !important;
    cursor: pointer;
    padding:11px 16px;
    font:bold 12px/14px Verdana, Tahomma, Geneva;
    text-shadow:rgba(0,0,0,0.2) 0 1px 0px; 
    color:#fff;
    -moz-box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;
    -webkit-box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;
    box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;
    margin-left:12px;
    float:right;
	padding:7px 21px;
}

.btnLogin:hover,
.btnLogin:focus,
.btnLogin:active{
    background:#a1d8f0;
    background:-moz-linear-gradient(top, #7acbed, #badff3);
    background:-webkit-gradient(linear, left top, left bottom, from(#7acbed), to(#badff3));
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#7acbed', EndColorStr='#badff3')";
}
.btnLogin:active{
    text-shadow:rgba(0,0,0,0.3) 0 -1px 0px; 
}

.error{
    background: #ffc4c4;
    border: 1px solid #C3D4DB;
	border-top:1px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
    -moz-box-shadow:rgba(0,0,0,0.15) 0 0 1px;
    -webkit-box-shadow:rgba(0,0,0,0.15) 0 0 1px;
    box-shadow:rgba(0,0,0,0.15) 0 0 1px;
    font:normal 12px/14px Arial, Helvetica, Sans-serif;	
	margin-left:auto;
	margin-right:auto;
	display:block;
    width:332px;
	margin-top:10px;
	padding: 35px 15px 15px 15px; 
	text-align:center;
	color:black;

	line-height:120%;
	letter-spacing: 1px;
}
.error label{
	float:left;
	margin:-25px 0px 0px 10px;
	color:#83080a;
    font:bolder 16px/18px Arial, Helvetica, Sans-serif;	

	letter-spacing: 3px;
}
.error#hard{
	background: #b31e1e;
	color:white;
}
.error#hard label{
	color:white;
}

.warning{
    background: #f7ffc4;
    border: 1px solid #C3D4DB;
	border-top:1px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
    -moz-box-shadow:rgba(0,0,0,0.15) 0 0 1px;
    -webkit-box-shadow:rgba(0,0,0,0.15) 0 0 1px;
    box-shadow:rgba(0,0,0,0.15) 0 0 1px;
    font:normal 12px/13px Arial, Helvetica, Sans-serif;	
	margin-left:auto;
	margin-right:auto;
	display:block;
    width:332px;
	margin-top:10px;
	padding: 35px 15px 15px 15px; 
	text-align:center;
	color:black;
	
	line-height:120%;
	letter-spacing: 1px;
}
.warning label{
	float:left;
	margin:-25px 0px 0px 10px;
	color:#83080a;
    font:bolder 16px/18px Arial, Helvetica, Sans-serif;	
	letter-spacing: 3px;
}
.warning#hard{
	background: #b3b11e;
	color:white;
}
.warning#hard label{
	color:white;
}

footer#main{
	position:fixed;
	bottom:1px;
	text-align:center;
	font:normal 10px/12px Arial, Helvetica, sans-serif;
	width:100%;
	background:#111;
	padding:5px;
	color:#ddd;
}

header#main{
	position:fixed;
	top: 0px;
	text-align:center;
	font:normal 12px/12px Arial, Helvetica, sans-serif;
	width:100%;
	background: #444;
	height:20px;
	color: #ddd;
	padding-top: 5px;
}
footer#main a{
	text-decoration:none;
}

footer#main a:link{
	color:#ccc;
}
footer#main a:visited{
	color:#999;
}
